<template>
  <div>obj: {{ obj.b.c }}</div>
  <div>rObj: {{ rObj.b.c }}</div>
  <div>refObj: {{ refObj.b.c }}</div>
  <div>
    <button @click="update">update</button>
  </div>
</template>

<script setup>
import { reactive, ref } from 'vue';
const obj = { a: 1, b: { c: 1 } }
const rObj = reactive(obj)
const refObj = ref(obj)
const update = () => {
  // obj.b.c++
  rObj.b.c++
}
</script>

<style scoped>
</style>